<template>
  <el-dialog
    v-model="visible"
    v-if="load"
    title="修改报关信息"
    width="960px"
    draggable
    @close="close"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    :z-index="2000"
  >
    <el-form :model="formValues" label-position="top" ref="formRef" class="mx-5 my-5">
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="中文报关名">
            <el-input v-model="formValues.cn_name" placeholder="请输入" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="英文报关名">
            <el-input v-model="formValues.en_name" placeholder="请输入" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="中文报关材质">
            <el-input v-model="formValues.cn_material" placeholder="请输入" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="英文报关材质">
            <el-input v-model="formValues.en_material" placeholder="请输入" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="海关编码">
            <el-input v-model="formValues.customs_code" placeholder="请输入" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="规格数量">
            <el-input v-model="formValues.customs_quantity" placeholder="请输入" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="报关单位">
            <el-input v-model="formValues.declare_unit" placeholder="例如:个,套,台" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="产品用途">
            <el-input v-model="formValues.purpose" placeholder="请输入" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="退税率">
            <el-input v-model="formValues.tax_rebate_rate" placeholder="请输入">
              <template #append>
                <el-button type="primary">%</el-button>
              </template>
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <div class="text-[#999]">
        <p>注：</p>
        <p>
          1、修改默认供应商的‘报关中文名’、‘报关单位’、‘规格型号’、‘海关编码’、‘退税率’、‘申报要素’，系统会自动生成变更单，审核通过后执行修改。
        </p>
      </div>
    </el-form>
    <template #footer>
      <div class="footer-btn">
        <el-button @click="close">取 消</el-button>
        <el-button type="primary" :loading="loading" @click="save">保 存</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup>
import { ElMessage, ElMessageBox } from "element-plus";
import { batchUpdateCustoms } from "../api.js";
import { changeOrderExist } from "@/api/index.js";
import { change_order_category } from "@/utils/data.js";

const visible = ref(false);
const loading = ref(false);
const dev_status = ref(false);
const formValues = ref({});
const ids = ref({
  is_all_supplier: 0,
});
const spu_category_list = ref([]);
const is_refund_tax_list = ref([]);
const combined_sources = ref([]);
const formRef = ref();
const emit = defineEmits(["refresh"]);
const load = ref(false);
const open = async (data) => {
  if (!load.value) {
    load.value = true;
    await 1;
  }
  ids.value[data.name] = data.ids;
  dev_status.value = data.dev_status;
  spu_category_list.value = data.spu_category;
  is_refund_tax_list.value = data.is_refund_tax;
  combined_sources.value = data.combined_sources;
  visible.value = true;
};

const save = async () => {
  const valid = await formRef.value.validate();
  if (!valid) return;
  await changeCheckbox(); // Check popup
};

const submit = async () => {
  loading.value = true;
  try {
    const res = await batchUpdateCustoms(
      Object.assign({}, ids.value, { params: formValues.value })
    );
    if (res.code === 200) {
      ElMessage.success("操作成功");
      close(true);
    }
  } catch (error) {
    console.log(error);
  } finally {
    loading.value = false;
  }
};

const close = async (refresh) => {
  ids.value = {
    is_all_supplier: 0,
  };
  formValues.value = {};
  await nextTick();
  await formRef.value.resetFields();
  if (refresh) emit("refresh");
  visible.value = false;
};
defineExpose({ open });

const changeCheckbox = async () => {
  const is_spu_category = spu_category_list.value.some((i) => {
    return change_order_category.includes(i.spu_category[0]);
  });

  const is_refund_tax = is_refund_tax_list.value.some((i) => {
    return i == 2;
  });

  const is_combined_sources = combined_sources.value.every((i) => {
    return i.combined_sources;
  });

  console.log(is_combined_sources);

  if (
    is_refund_tax &&
    formValues.value.tax_rebate_rate &&
    Number(formValues.value.tax_rebate_rate || 0) == 0
  ) {
    return ElMessage.error("退税供应商的退税率必须>0，请确认");
  }

  if (dev_status.value && is_spu_category && is_refund_tax && !is_combined_sources) {
    changeOrderExist({
      sku_id: ids.value.sku_ids,
    }).then(async (res) => {
      if (res.data.exist) {
        ElMessageBox.confirm(
          "所选数据中,在<商品资料变更单>存在待审核的变更单,无法修改，请审核通过后再进行调整；点击保存后，将自动剔除该类数据对于中文报关名、报关单位的修改；将自动剔除该类数据对于中文报关名、报关单位、报关单位、退税率、申报要素的修改；",
          "提示",
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }
        )
          .then(async () => {
            submit();
          })
          .finally(async () => {});
      } else {
        if (
          formValues.value.cn_name ||
          formValues.value.declare_unit ||
          formValues.value.declare_elements ||
          formValues.value.spec_model ||
          formValues.value.customs_code ||
          formValues.value.tax_rate ||
          formValues.value.tax_rebate_rate ||
          formValues.value.customs_quantity
        ) {
          const res = await ElMessageBox.confirm(
            "所选数据中，含有SKU开发状态=通过，且绑定的供应商存在是否退税=退税；更换默认供应商，或者修改退税供应商的‘报关中文名’、‘报关单位’、‘规格型号’、‘海关编码’、‘退税率’、‘申报要素’，点击确认后，系统将自动生成变更单，审核通过后执行修改，是否确认修改？",
            "提示",
            {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            }
          ).then(async () => {
            submit();
          });
        } else {
          submit();
        }
      }
    });
  } else {
    submit();
  }
};
</script>
<style lang="scss" scoped>
.footer-btn {
  :deep(.el-button + .el-button) {
    margin-left: 8px !important;
  }
}
</style>
